import React, { useState, useEffect } from "react";
import { Modal, Form, Row, Space, Button, Input, Image, message, Radio, RadioChangeEvent } from "antd";
import { twWithdrawalExamine } from './service';
import moment from "moment";
import "./index.less";
const ForumInfo = (props) => {
  const { isOpen, onClose, updateData, getList } = props;
  const [form] = Form.useForm();

  const FORUMTYPE = {
  // 0上线;1下线;2审核中;3审核拒绝；4待付款；5已卖出
  0: '上线',
  1: '下线',
  2: '审核中',
  3: '审核拒绝',
  4: '待付款',
  5: '已卖出'
} as {
  [key: number]: string
}

  useEffect(() => {
    form.setFieldsValue({
      ...updateData,
      createTime: moment(updateData.createTime).format('YYYY-MM-DD hh:mm'),
      status: FORUMTYPE[updateData.status],
      address: `${updateData.province} ${updateData.city} ${updateData.area}`
  })
  }, [isOpen])

  const onCloseModal = () => {
    form.resetFields()
    onClose()
  }

  const onSubmit = async () => {
    const values = await form.validateFields()
    const res = await twWithdrawalExamine({
      id: updateData.id,
      ...values
    })
    if (res) {
      message.success('操作成功')
      onClose()
      getList()
    }
  }
  const onChangeType = ({ target: { value } }: RadioChangeEvent) => {
    form.setFieldValue('status', value)
  };

  const formItemLayout = {
    labelCol: {
      // xs: { span: 24 },
      sm: { span: 4 },
    },
    wrapperCol: {
      // xs: { span: 24 },
      // sm: { span: 14 },
    },
  };
  
  return (
    <Modal
      width={600}
      title={'审核'}
      open={isOpen}
      onOk={onSubmit}
      onCancel={onCloseModal}
    >
      <Form {...formItemLayout} form={form} labelAlign="right">
        <Form.Item name="status" label="审核意见">
          <Radio.Group
            onChange={onChangeType}
            options={[
              { value: 0, label: '通过' },
              { value: 2, label: '拒绝' }
            ]}
          />
        </Form.Item>
        {updateData.type === 'reject' ? <Form.Item name="feedback" label="反馈意见" rules={[
          {
            required: true,
            message: '必填',
          },
        ]}>
          <Input placeholder="请输入" />
        </Form.Item> : null}
      </Form>
    </Modal>
  );
};
export default ForumInfo;
